<template>
	<view class="page">
		<view class="bar_info" :style="{height:(200+StatusBarRpx)+'rpx',paddingTop:StatusBarRpx+'rpx'}">
			<view class="title_bar">
				<view class="title_bar_left">
					<image :src='STATIC_URL+"7.png"' mode="aspectFill"></image>
					<text>洛阳聚肴商贸有限公司</text>
				</view>
				<view class="title_bar_right"></view>
			</view>
			<view class="cart_title flex align-center">
				<view class="go_shop flex align-center justify-center" @tap.stop="goHome">
					<image :src='STATIC_URL+"31.png"' mode="aspectFill"></image>
					<text>一键购物</text>
				</view>
				<view class="search_info" @tap.stop="handleJump" data-type="navigateTo" :data-url="`/pages/index/search`">
					<image class="search_icon" :src='STATIC_URL+"9.png"' mode="aspectFill"></image>
					<input class="search_input" type="text" placeholder="输入商品关键词" :disabled="true"
						placeholder-style="font-size: 26rpx;color: #8B8B8B;">
				</view>
				<view class="del_text" @tap.stop="delCart">删除</view>
			</view>
		</view>
		<view :style="{height: (200+StatusBarRpx)+'rpx'}"></view>

		<view class="loading_css" v-if="isShow">
			<u-loading size="36" color="#41AF36"></u-loading>
			<view class="loading_text">加载中</view>
		</view>
		<block v-else>
			<view class="shop_list">
				<view class="shop_item flex" v-for="(item, index) in list" :key="index" :class="item.business_id == 0 ? 'shop_item_no' : ''">
					<view class="select_le" @tap.stop="selectShop(index)">
						<image v-if="item.isSelect" :src='STATIC_URL+"2.png"' mode="aspectFill"></image>
						<image v-else :src='STATIC_URL+"3.png"' mode="aspectFill"></image>
					</view>
					<view class="select_ri flex align-center">
						<view class="item_left_img">
							<u-lazy-load :image="item.image" img-mode="aspectFill" height="180"
								border-radius="8"></u-lazy-load>
							<image v-if="item.business_id == 0" class="shelf_img" :src='STATIC_URL+"50.png"' mode=""></image>
						</view>
						<view class="item_right">
							<view class="flex align-center justify-between">
								<view class="shop_name">{{item.name}}</view>
								<view class="specification" v-if="item.specification">规格：{{item.specification}}</view>
							</view>
							<view class="shop_price flex align-center justify-between">
								<view class="price_text">
									<template v-if="user.is_show_price == 1">
										<text class="price_1">￥</text>
										<text class="price_2">{{item.price}}</text>
										<text class="price_3">/{{filterDictionary(item.unit)}}</text>
									</template>
									<text class="price_3" v-else>单位：{{filterDictionary(item.unit)}}</text>
								</view>
								<view class="shop_num flex align-center justify-end" @tap.stop="changeNum(item)">
									<template v-if="item.count">
										<image :src='STATIC_URL+"19.png"' mode="aspectFill"></image>
										<view class="shop_num_input">{{item.count}}</view>
									</template>
									<image :src='STATIC_URL+"20.png"' mode="aspectFill"></image>
								</view>
							</view>
							<view class="notes_info flex align-center">
								<view class="notes_label">备注：</view>
								<input v-model="item.remark" class="notes_input" type="text" placeholder="请输入备注信息" placeholder-style="font-size:26rpx;color:#B8B8B8;" @blur="changeRemark(index)" :disabled="item.business_id == 0 ? true : false">
							</view>
						</view>
					</view>

				</view>
			</view>
			<view class="noData" v-if="list.length == 0 && !isShow">
				<image src="/static/empty/no.png"></image>
			</view>
			<view class="cart_bom flex align-center justify-between" v-if="list.length > 0">
				<view class="bom_le flex align-center">
					<view class="bom_le_1 flex align-center" @tap.stop="selectAll">
						<image v-if="is_total" :src='STATIC_URL+"2.png"' mode="aspectFill"></image>
						<image v-else :src='STATIC_URL+"3.png"' mode="aspectFill"></image>
						<text>全选</text>
					</view>
					<view class="bom_le_2">
						<view class="bom_le_price">
							<text class="bom_le_price_1">合计:</text>
							<text class="bom_le_price_2">￥</text>
							<text class="bom_le_price_3" v-if="user.is_show_price == 1">{{totalPrice}}</text>
							<text class="bom_le_price_3" v-else>0</text>
						</view>
						<view class="bom_le_price_tip">免配送费</view>
					</view>
				</view>
				<view class="flex align-center">
					<view class="bom_ri flex align-center justify-center" @tap.stop="additional">
						<text>去补单</text>
						<text v-if="product_id.length > 0">({{product_id.length}})</text>
					</view>
					<view class="bom_ri flex align-center justify-center" style="margin-left: 24rpx;" @tap.stop="settlement">
						<text>去结算</text>
						<text v-if="product_id.length > 0">({{product_id.length}})</text>
					</view>
				</view>
			</view>
			<view style="height: 120rpx;" v-if="list.length > 0"></view>
		</block>

		<cart-popup :source="2" ref="cart" :item="shopItemInfo" @changeShop="changeShopInfo"></cart-popup>

		<u-mask :show="show" @click="show = false">
			<view class="warp">
				<view class="rect" @tap.stop>
					<view class="rect_1">提示</view>
					<view class="rect_2">确定删除这{{product_id.length}}种商品吗？</view>
					<view class="rect_3 flex align-center justify-between">
						<view class="rect_3_1 flex align-center justify-center" @tap="show = false">取消</view>
						<view class="rect_3_2 flex align-center justify-center" @tap="confirmDel(1)">确定</view>
					</view>
				</view>
			</view>
		</u-mask>

		<u-popup v-model="timeShow" mode="bottom" border-radius="24">
			<view class="time_pop">
				<view class="time_title">选择时间</view>
				<scroll-view scroll-y="true" class="time_scoll">
					<view class="time_one_list" v-for="(item, index) in timeList" :key="index">
						<view class="time_one_date">{{item.date}}</view>
						<view class="time_two_date">
							<view class="time_two_date_text flex align-center justify-center" :class="v.isSelect ? 'active_text' : ''" v-for="(v, k) in item.timeDate" @tap.stop="selectTime(index, k)">{{v.time}}</view>
						</view>
					</view>
				</scroll-view>
				<view class="notes_info flex align-center">
					<view class="notes_info_1">下单备注：</view>
					<input class="notes_info_2" v-model="order_remarks" type="text" placeholder="请输入备注信息" placeholder-style="font-size: 26rpx;color: #999;">
				</view>
				<view class="pop_btn flex align-center justify-between">
					<view class="pop_btn_1 flex align-center justify-center" @tap.stop="clearTime">取消</view>
					<view class="pop_btn_2 flex align-center justify-center" @tap.stop="confirmTime">确定</view>
				</view>
			</view>
		</u-popup>
		
		
		<u-popup v-model="timeShow" mode="bottom" border-radius="24">
			<view class="time_pop">
				<view class="time_title">选择时间</view>
				<scroll-view scroll-y="true" class="time_scoll">
					<view class="time_one_list" v-for="(item, index) in timeList" :key="index">
						<view class="time_one_date">{{item.date}}</view>
						<view class="time_two_date">
							<view class="time_two_date_text flex align-center justify-center" :class="v.isSelect ? 'active_text' : ''" v-for="(v, k) in item.timeDate" @tap.stop="selectTime(index, k)">{{v.time}}</view>
						</view>
					</view>
				</scroll-view>
				<view class="notes_info flex align-center">
					<view class="notes_info_1">备注：</view>
					<input class="notes_info_2" v-model="order_remarks" type="text" placeholder="请输入备注信息" placeholder-style="font-size: 26rpx;color: #999;">
				</view>
				<view class="pop_btn flex align-center justify-between">
					<view class="pop_btn_1 flex align-center justify-center" @tap.stop="clearTime">取消</view>
					<view class="pop_btn_2 flex align-center justify-center" @tap.stop="confirmTime">确定</view>
				</view>
			</view>
		</u-popup>
		
		<u-popup v-model="additional_show" mode="bottom" border-radius="24">
			<view class="time_pop">
				<view class="time_title">补单</view>
				<view class="date_name flex align-center justify-between" @tap.stop="selectAdditional">
					<view v-if="supplement_date">{{supplement_date}}</view>
					<view v-else>选择补单日期</view>
					<image :src='STATIC_URL+"46.png"' mode=""></image>
				</view>
				<view scroll-y="true" class="times_scoll">
					<view class="time_one_list">
						<view class="time_two_date">
							<view class="time_two_date_text flex align-center justify-center" :class="v.isSelect ? 'active_text' : ''" v-for="(v, k) in oneTime" @tap.stop="selectAdditionalTime(k)">{{v.time}}</view>
						</view>
					</view>
				</view>
				<view class="notes_info flex align-center">
					<view class="notes_info_1">备注：</view>
					<input class="notes_info_2" v-model="order_remarks" type="text" placeholder="请输入备注信息" placeholder-style="font-size: 26rpx;color: #999;">
				</view>
				<view class="pop_btn flex align-center justify-between">
					<view class="pop_btn_1 flex align-center justify-center" @tap.stop="clearTime">取消</view>
					<view class="pop_btn_2 flex align-center justify-center" @tap.stop="confirmTime">确定</view>
				</view>
			</view>
		</u-popup>
		
		
		<benben-picker ref="benbenWritePickerCodepicker3" :visible.sync="supplement_show"
			:value.sync='supplement_date' mode='date' :picker-height='88' :current='true' :mask-show='true'
			fields='day' :timeout='true' start-year='1970-01-01' end-year='现在' @cancel="dateCancel" @confirm="dateConfirm">
			<template #picker-header>
				<view class='myInformation_picker3_0'>
					<text @tap="$refs.benbenWritePickerCodepicker3.cancel()">取消</text>
					<text>选择补单日期</text>
					<text class='myInformation_picker3_0_c2'
						@tap="$refs.benbenWritePickerCodepicker3.pickerConfirm()">确认</text>
				</view>
			</template>
		</benben-picker>
	</view>
</template>

<script>
	import cartPopup from "@/components/cartPopup/cartPopup.vue"
	export default {
		data() {
			return {
				show: false,
				isShow: true,
				is_total: false,
				list: [],
				image: "",
				token: "",
				scene: "",
				shopItemInfo: "",
				totalPrice: 0,
				totalNum: 0,
				product_id: [],
				userInfo: {},
				timeShow: false,
				timeList: [],  // 时间列表
				dispatching_time: [],
				user: {},
				order_remarks: "",
				
				oneTime: [],
				additional_show: false,
				supplement_show: false,
				supplement_date: "",
				is_repair: 0,  // 1补录订单
			}
		},
		components: {
			cartPopup,
		},
		computed: {
			
		},
		watch: {
			
		},
		onLoad() {

		},
		onShow() {
			this.user = global.userInfo;
			this.is_total = false;
			this.totalPrice = 0;
			this.totalNum = 0;
			this.product_id = [];
			this.getCartList();
			this.getUserInfo();
			this.clearTime();
		},
		// 下拉刷新
		onPullDownRefresh() {
			
		},
		methods: {
			// 获取用户资料  postUserInfo
			getUserInfo() {
				this.$api.post(global.apiUrls.glyUser, {

				}).then(res => {
					if (res.data.code == 200) {
						this.userInfo = res.data.data;
						this.getOrderTime();
					} else {
						this.$message.info(res.data.message);
					}
				})
			},
			// 获取时间段
			getOrderTime() {
				this.$api.get(global.apiUrls.gylTime, {
					customer_id: this.userInfo.id
				}).then(res => {
					// console.log(res);
					if (res.data.code == 200) {
						this.timeList = res.data.data;
						if (this.timeList.length > 0) {
							this.timeList.forEach((v, k) => {
								v.timeDate = [];
								if (v.times.length > 0) {
									v.times.forEach((v1, k1) => {
										v.timeDate.push({
											isSelect: false,
											time: v1
										})
									})
								}
							})
							this.oneTime = this.timeList[0].timeDate;
						}
					} else {
						this.$message.info(res.data.message);
					}
				})
			},
			selectTime(index, index1) {
				if (this.timeList[index].timeDate[index1].isSelect) {
					this.timeList[index].timeDate[index1].isSelect = false;
				} else {
					this.timeList[index].timeDate.forEach((v, k) => {
						v.isSelect = false;
					})
					this.timeList[index].timeDate[index1].isSelect = true;
				}
				this.$forceUpdate();
				let dispatching_time = [];
				this.timeList.forEach((v, k) => {
					if (v.timeDate.length > 0) {
						v.timeDate.forEach((v1, k1) => {
							if (v1.isSelect) {
								dispatching_time.push(v.year + '-' + v.date.slice(0, 5)  + ' ' + v1.time + ':00')
							}
						})
					}
				})
				this.dispatching_time = dispatching_time;
			},
			confirmTime() {
				if (this.dispatching_time.length == 0) {
					this.$message.info('请选择时间');
					return;
				}
				this.timeShow = false;
				this.supplement_show = false;
				let total_count = 0;
				let goods = [];
				this.product_id.forEach(id => {
					const index = this.list.findIndex(item => item.id === id);
					if (index !== -1) {
						goods.push({
							product_id: this.list[index].product_id,
							business_id: this.list[index].business_id,
							count: this.list[index].count,
							price: this.list[index].price,
							remark: this.list[index].remark
						});
					}
					total_count += Number(this.list[index].count);
				});
				uni.showLoading({
					title: '提交中'
				})
				this.$api.post(global.apiUrls.gylCreatOrder, {
					is_repair: this.is_repair,
					dispatching_time: JSON.stringify(this.dispatching_time),
					status: 0,
					is_merge: 0,
					goods: JSON.stringify(goods),
					total_price: this.totalPrice,
					total_count: total_count,
					remark: this.order_remarks
				}).then(res => {
					uni.hideLoading();
					this.$message.info(res.data.message);
					if (res.data.code == 200) {
						this.product_id = [];
						this.isShow = true;
						this.getCartList();
						this.clearTime();
						uni.$emit('cartChange');
						// setTimeout(() => {
						// 	uni.navigateTo({
						// 		url: '/pages/my/order?current=0'
						// 	})
						// }, 800)
					}
				}).catch(err => {
					uni.hideLoading();
				})
				
			},
			clearTime() {
				this.timeShow = false;
				this.dispatching_time = [];
				this.order_remarks = "";
				this.timeList.forEach((v, k) => {
					if (v.timeDate.length > 0) {
						v.timeDate.forEach((v1, k1) => {
							v1.isSelect = false;
						})
					}
				})
				
				this.additional_show = false;
				this.supplement_show = false;
				this.supplement_date = "";
			},
			// 正常下单
			settlement() {
				if (this.product_id.length == 0) {
					this.$message.info('请选择商品');
					return;
				}
				let index = -1;
				this.list.forEach((v, k) => {
					if (v.is_shelf == 1 && v.isSelect) {
						index = k;
					}
				})
				if (index != -1) {
					this.$message.info('请删除已下架商品后下单');
					return;
				}
				
				this.timeShow = true;
				this.is_repair = 0;
			},

			changeNum(item) {
				if (item.business_id == 0) return;
				this.shopItemInfo = item;
				this.$refs.cart.openCart();
			},
			changeShopInfo(e) {
				let index = this.list.findIndex(item => item.id == e.id);
				this.list[index].count = e.count;
				this.list[index].remark = e.remark;
			},
			changeRemark(index) {
				this.$api.post(global.apiUrls.gylAddCars, {
					product_id: this.list[index].product_id,
					business_id: this.list[index].business_id,
					count: this.list[index].count,
					remark: this.list[index].remark
				}).then(res => {
					this.$message.info(res.data.message);
				})
			},
			getCartList() {
				this.$api.get(global.apiUrls.gylCars, {
					
				}).then(res => {
					// console.log(res);
					this.isShow = false;
					if (res.data.code == 200) {
						this.list = res.data.data;
						this.totalNum = this.list.length;
						if (this.list.length > 0) {
							this.list.forEach((v, k) => {
								v.isSelect = false;
								if (v.business_id == 0) {
									v.is_shelf = 1;
								} else {
									v.is_shelf = 0;
								}
							})
						}
						this.is_total = false;
					} else {
						this.$message.info(res.data.message);
					}
				})
			},
			selectAll() {
				this.product_id = [];
				if (this.is_total) {
					this.is_total = false;
					this.list.forEach((v, k) => {
						v.isSelect = false;
					})
					this.totalPrice = 0;
				} else {
					this.is_total = true;
					let totalPrice = 0;
					this.list.forEach((v, k) => {
						if (v.is_shelf == 0) {
							v.isSelect = true;
							this.product_id.push(v.id);
							totalPrice += Number(v.count) * Number(v.price);
						}
					})
					this.totalPrice = totalPrice.toFixed(2);
				}
			},
			selectShop(index) {
				this.list[index].isSelect = !this.list[index].isSelect;
				let num = -1;
				this.list.forEach((v, k) => {
					if (!v.isSelect) {
						if (v.is_shelf == 0) {
							num = k;
						}
					}
				})
				if (num == -1) {
					this.is_total = true;
				} else {
					this.is_total = false;
				}
				this.product_id = [];
				let totalPrice = 0;
				this.list.forEach((v, k) => {
					if (v.isSelect) {
						this.product_id.push(v.id);
						totalPrice += Number(v.count) * Number(v.price);
					}
				})
				this.totalPrice = totalPrice.toFixed(2);
				this.$forceUpdate();
			},
			// 删除
			delCart() {
				if (this.product_id.length == 0) {
					this.$message.info('请选择商品');
					return;
				}
				this.show = true;
			},
			// 确认删除购物袋
			confirmDel(type) {
				this.show = false;
				this.$api.post(global.apiUrls.gylDelCars, {
					cart_ids: this.product_id.join(',')
				}).then(res => {
					this.$message.info(res.data.message);
					if (res.data.code == 200) {
						this.product_id = [];
						this.is_total = false;
						this.isShow = true;
						this.getCartList();
						uni.$emit('cartChange');
					}
				})
			},
			// 补录订单
			additional() {
				if (this.product_id.length == 0) {
					this.$message.info('请选择商品');
					return;
				}
				let index = -1;
				this.list.forEach((v, k) => {
					if (v.is_shelf == 1 && v.isSelect) {
						index = k;
					}
				})
				if (index != -1) {
					this.$message.info('请删除已下架商品后下单');
					return;
				}
				this.additional_show = true;
				this.is_repair = 1;
			},
			selectAdditional() {
				this.additional_show = false;
				this.supplement_show = true;
			},
			dateCancel() {
				this.additional_show = true;
			},
			dateConfirm() {
				this.additional_show = true;
			},
			selectAdditionalTime(index1) {
				if (!this.supplement_date) {
					this.$message.info('请选择补单日期');
					return;
				}
				if (this.oneTime[index1].isSelect) {
					this.oneTime[index1].isSelect = false;
				} else {
					this.oneTime.forEach((v, k) => {
						v.isSelect = false;
					})
					this.oneTime[index1].isSelect = true;
				}
				this.$forceUpdate();
				let dispatching_time = [];
				this.oneTime.forEach((v1, k1) => {
					if (v1.isSelect) {
						dispatching_time.push(this.supplement_date + ' ' + v1.time + ':00');
					}
				})
				this.dispatching_time = dispatching_time;
			},
			goHome() {
				uni.switchTab({
					url: '/pages/tabbar/index'
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	.time_pop {
		.date_name {
			background: #eee;
			border-radius: 8rpx;
			padding: 12rpx;
			font-size: 28rpx;
			margin: 0 24rpx;
			image {
				width: 28rpx;
				height: 28rpx;
			}
		}
		.time_title {
			text-align: center;
			font-size: 36rpx;
			padding: 24rpx;
			font-weight: 600;
		}
		.time_scoll {
			height: 700rpx;
		}
		.times_scoll {
			margin: 28rpx 0;
		}
		.time_one_list {
			padding: 0 24rpx;
			.time_one_date {
				font-size: 30rpx;
			}
			.time_two_date {
				margin-top: 16rpx;
				overflow: hidden;
				.time_two_date_text {
					float: left;
					width: 88rpx;
					height: 44rpx;
					border-radius: 8rpx;
					font-size: 28rpx;
					background: #eee;
					margin: 0 12rpx 16rpx 0;
				}
				.active_text {
					background: #41AF36 !important;
					color: #fff !important;
				}
			}
		}
		.notes_info {
			padding: 16rpx 32rpx;
			.notes_info_1 {
				font-size: 28rpx;
			}
			.notes_info_2 {
				height: 58rpx;
				padding: 0 16rpx;
				font-size: 26rpx;
				flex: 1;
				background: #eee;
				border-radius: 8rpx;
			}
		}
		.pop_btn {
			padding: 16rpx 24rpx 24rpx;
			.pop_btn_1 {
				font-size: 30rpx;
				background: #eee;
				width: 330rpx;
				height: 72rpx;
				border-radius: 12rpx;
			}
			.pop_btn_2 {
				font-size: 30rpx;
				background: #41AF36;
				color: #fff;
				width: 330rpx;
				height: 72rpx;
				border-radius: 12rpx;
			}
		}
	}
	.page {
		background: url(https://www.shiyaocanyin.com/images/8.png) no-repeat #f5f5f5;
		background-size: 100% auto !important;
		min-height: calc(100vh - var(--window-bottom));

		.bar_info {
			width: 750rpx;
			height: 88rpx;
			overflow: hidden;
			// border-bottom: 1px solid #eee;
			// background: #fff;
			z-index: 10;
			position: fixed;
			top: 0rpx;
			background: url(https://www.shiyaocanyin.com/images/8.png) no-repeat;
			background-size: 100% auto;
			border-radius: 0 0 10rpx 10rpx;
			.title_bar {
				padding: 0 32rpx;
				display: flex;
				align-items: center;
				justify-content: space-between;
				margin-top: 24rpx;

				.title_bar_left {
					display: flex;
					align-items: center;

					image {
						width: 36rpx;
						height: 36rpx;
					}

					text {
						font-weight: 500;
						font-size: 30rpx;
						color: #FFFFFF;
						margin-left: 10rpx;
					}
				}

				.title_bar_center {
					line-height: 88rpx;
					font-size: 36rpx;
					font-weight: 400;
					color: #fff;
				}

				.title_bar_right {}
			}
		}

		.cart_title {
			padding: 36rpx 30rpx 30rpx;
			
			.go_shop {
				width: 200rpx;
				height: 70rpx;
				background: #FFFFFF;
				border-radius: 50rpx;

				image {
					width: 48rpx;
					height: 48rpx;
					margin-right: 6rpx;
				}

				text {
					font-weight: 400;
					font-size: 26rpx;
					color: #3D3D3D;
				}
			}

			.search_info {
				margin: 0 0 0 12rpx;
				width: 390rpx;
				height: 70rpx;
				background: #fff;
				border-radius: 100rpx;
				position: relative;

				.search_icon {
					width: 30rpx;
					height: 30rpx;
					position: absolute;
					left: 30rpx;
					top: 20rpx;
				}

				.search_input {
					height: 70rpx;
					display: flex;
					flex: 1;
					padding: 0 32rpx 0 80rpx;
					font-size: 26rpx;
				}
			}

			.del_text {
				display: flex;
				flex: 1;
				justify-content: flex-end;
				font-weight: 400;
				font-size: 26rpx;
				color: #3D3D3D;
			}
		}

		.shop_list {
			padding: 0 20rpx;
			.shop_item_no {
				background: #eee !important;
			}
			.shop_item {
				background: #fff;
				border-radius: 10rpx;
				padding: 30rpx 20rpx;
				margin-bottom: 20rpx;

				.select_le {
					width: 60rpx;
					display: flex;
					align-items: center;

					image {
						width: 40rpx;
						height: 40rpx;
					}
				}

				.select_ri {
					flex: 1;
				}

				.item_left_img {
					width: 150rpx;
					height: 150rpx;
					position: relative;
					.shelf_img {
						width: 100%;
						height: 100%;
						position: absolute;
						top: 0;
						left: 0;
						z-index: 10;
					}
				}

				/deep/.u-lazy-item {
					width: 150rpx !important;
					height: 150rpx !important;
				}

				.item_right {
					width: calc(100% - 150rpx);
					padding: 0 0 0 30rpx;

					.shop_name {
						font-weight: 500;
						font-size: 30rpx;
						color: #3D3D3D;
						text-overflow: ellipsis;
						overflow: hidden;
						white-space: nowrap;
					}
					.specification {
						color: #999;
						font-size: 24rpx;
					}

					.shop_price {
						margin-top: 18rpx;
						.price_text {
							.price_1 {
								color: #D43C3B;
								font-size: 24rpx;
								font-weight: 600;
							}

							.price_2 {
								color: #D43C3B;
								font-size: 40rpx;
								font-weight: 600;
							}

							.price_3 {
								color: #989898;
								font-size: 24rpx;
								font-weight: 500;
							}
						}

						.shop_num {
							image {
								width: 60rpx;
								height: 40rpx;
							}

							.shop_num_input {
								text-align: center;
								margin: 0 16rpx;
								font-weight: 400;
								font-size: 30rpx;
								color: #3D3D3D;
							}
						}
					}

					.notes_info {
						margin-top: 10rpx;

						.notes_label {
							font-weight: 400;
							font-size: 26rpx;
							color: #B8B8B8;
						}
						.notes_input {
							font-weight: 400;
							font-size: 26rpx;
						}
					}
				}
			}
		}

		.cart_bom {
			width: 750rpx;
			height: 110rpx;
			background: #fff;
			position: fixed;
			bottom: 0;
			left: 0;
			z-index: 10;
			padding: 15rpx 20rpx;

			.bom_le {
				.bom_le_1 {
					font-weight: 400;
					font-size: 26rpx;
					color: #A9A9A9;

					image {
						width: 40rpx;
						height: 40rpx;
						margin-right: 20rpx;
					}
				}

				.bom_le_2 {
					margin-left: 24rpx;

					.bom_le_price {
						.bom_le_price_1 {
							color: #3A3A3A;
							font-size: 26rpx;
						}

						.bom_le_price_2 {
							color: #D43C3B;
							font-size: 26rpx;
							font-weight: 600;
						}

						.bom_le_price_3 {
							color: #D43C3B;
							font-size: 36rpx;
							font-weight: 600;
						}
					}

					.bom_le_price_tip {
						font-weight: 400;
						font-size: 22rpx;
						color: #A9A9A9;
					}
				}
			}

			.bom_ri {
				width: 180rpx;
				height: 70rpx;
				background: #41AF36;
				border-radius: 42rpx;
				font-weight: 500;
				font-size: 26rpx;
				color: #FFFFFF;
			}
		}
	}

	.warp {
		display: flex;
		align-items: center;
		justify-content: center;
		height: 100%;
	}

	.rect {
		width: 600rpx;
		height: 360rpx;
		background-color: #fff;
		background: url(https://www.shiyaocanyin.com/images/32.png) no-repeat;
		background-size: 100% 100%;
	}

	.rect_1 {
		font-weight: 500;
		font-size: 42rpx;
		color: #3D3D3D;
		text-align: center;
		padding: 40rpx 0 30rpx;
	}

	.rect_2 {
		font-weight: 400;
		font-size: 30rpx;
		color: #3D3D3D;
		text-align: center;
	}

	.rect_3 {
		margin-top: 66rpx;
		padding: 0 60rpx;

		.rect_3_1 {
			width: 220rpx;
			height: 70rpx;
			background: #F0F0F0;
			border-radius: 50rpx;
			font-weight: 500;
			font-size: 30rpx;
			color: #323232;
		}

		.rect_3_2 {
			width: 220rpx;
			height: 70rpx;
			background: #41AF36;
			border-radius: 50rpx;
			font-weight: 500;
			font-size: 30rpx;
			color: #fff;
		}
	}
	
	
	.myInformation_picker3_0_c2 {
		color: #41AF36;
	}
	
	.myInformation_picker3_0 {
		border-bottom: 1px solid #eee;
		background: #fff;
		padding: 0rpx 32rpx 0rpx 32rpx;
		line-height: 88rpx;
		border-radius: 25rpx 25rpx 0rpx 0rpx;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}
</style>